<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>答题</title>

    <!-- Fonts -->
    <link href="{{URL::asset('/assets/css/font-awesome.min.css')}}" rel='stylesheet' type='text/css'>
    <link href="{{URL::asset('/assets/css/font.css')}}" rel='stylesheet' type='text/css'>

    <!-- Styles -->
    <link href="{{URL::asset('/assets/css/bootstrap.min.css')}}" rel="stylesheet">

    <style>
        body {
            font-family: 'Lato';
        }

        .fa-btn {
            margin-right: 6px;
        }
    </style>

    <script type="text/javascript">
        $(":file").filestyle({icon: false});
    </script>




</head>
<body id="app-layout">
    <nav class="navbar navbar-default">
        <div class="container">
            <div class="navbar-header">

                <!-- Collapsed Hamburger -->
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#app-navbar-collapse">
                    <span class="sr-only">Toggle Navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>

                <!-- Branding Image -->
                <a class="navbar-brand" disabled>
                    答题
                </a>
            </div>

            <div class="collapse navbar-collapse" id="app-navbar-collapse">
                <!-- Left Side Of Navbar -->
                <ul class="nav navbar-nav text-center">
                    <li><a id="showCodeLabel" >Code:</a></li>
                    <li><a id="showCode" ></a></li>
                    <li><a id="startState" ></a></li>
                </ul>

                <!-- Right Side Of Navbar -->
                <ul class="nav navbar-nav navbar-right">
                    <!-- Authentication Links -->
                    <li data-toggle="modal" data-target="#myModal"><a href="#">上传文件</a></li>
                    <li data-toggle="modal" data-target="#myModal2"><a href="#">设置</a></li>
                    <li data-toggle="modal" data-target="#myModal3"><a href="#">下载结果</a></li>
                    @if (Auth::guest())

                    @else
                        <li class="dropdown">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
                                {{ Auth::user()->name }} <span class="caret"></span>
                            </a>

                            <ul class="dropdown-menu" role="menu">
                                <li><a href="{{ url('/logout') }}"><i class="fa fa-btn fa-sign-out"></i>Logout</a></li>
                            </ul>
                        </li>
                    @endif
                </ul>
            </div>
        </div>
    </nav>

    <div class="modal fade" id="myModal" tabindex="-1" role="dialog"
                   aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close"
                            data-dismiss="modal" aria-hidden="true">
                        &times;
                    </button>
                    <h4 class="modal-title" id="myModalLabel">
                        上传文件
                    </h4>
                </div>
                <form id="fileupload" method="POST" action="" enctype="multipart/form-data" style="margin-left: 20px;margin-top: 10px;margin-right: 20px;margin-bottom: 10px;">
                        <h5>上传学生名单</h5>
                        <input type="file" class="filestyle" data-icon="false" name="myfile">
                        <h5>上传题目</h5>
                        <input type="file" class="filestyle" data-icon="false" name="myfile2">
                </form>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default"
                            data-dismiss="modal">关闭
                    </button>
                    {{--<input type="submit" name="submit" value="Submit">--}}
                    <button id="uploadf" class="btn btn-primary" >提交</button>
                </div>

            </div><!-- /.modal-content -->
        </div><!-- /.modal -->
    </div>

    <div class="modal fade" id="myModal2" tabindex="-1" role="dialog"
         aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close"
                            data-dismiss="modal" aria-hidden="true">
                        &times;
                    </button>
                    <h4 class="modal-title" id="myModalLabel">
                        提交AskCode
                    </h4>
                </div>
                <form id="askform" style="margin-left: 20px;margin-top: 10px;margin-right: 20px;">
                    <div class="form-group">
                        <input id="askscode" type="text" class="form-control"/>
                    </div>
                </form>

                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭
                    </button>
                    {{--<input type="submit" name="submit" value="Submit">--}}
                    <button id="subcode" class="btn btn-primary" >提交</button>

                </div>


            </div><!-- /.modal-content -->
        </div><!-- /.modal -->
    </div>

    <div class="modal fade" id="myModal3" tabindex="-1" role="dialog"
         aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close"
                            data-dismiss="modal" aria-hidden="true">
                        &times;
                    </button>
                    <h4 class="modal-title" id="myModalLabel">
                        下载结果
                    </h4>
                </div>
                <form action="/save" method="get" id="askform" style="margin-left: 20px;margin-top: 10px;margin-right: 20px;">
                    <h5>请输入结果的Code</h5>
                    <div class="form-group">
                        <input id="downAskCode" name="askCode" type="text" class="form-control"/>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default"
                                data-dismiss="modal">关闭
                        </button>
                        {{--<input type="submit" name="submit" value="Submit">--}}
                        <input type="submit" class="btn btn-primary" value="下载">
                    </div>
                </form>



            </div><!-- /.modal-content -->
        </div><!-- /.modal -->
    </div>

    @yield('content')

    <!-- JavaScripts -->
    <script src="{{URL::asset('/assets/js/jquery.min.js')}}"></script>
    <script src="{{URL::asset('/assets/js/bootstrap.min.js')}}"></script>
    <script src="{{URL::asset('/assets/js/bootstrap-filestyle.min.js')}}"></script>
    <script src="{{URL::asset('/assets/js/jquery.form.min.js')}}"></script>
    {{-- <script src="{{ elixir('js/app.js') }}"></script> --}}
    <script type="text/javascript">

        var index = 0;
        var askCode;
        var autoStartFlag = 0;
        $(document).ready(function(){

            $("#moreinfoDiv > *").hide();

            $("#subcode").click(function(){
                var setAskCode = $("#askscode").val();
                $("#showCode").text(setAskCode);
                $("#downAskCode").val(setAskCode);
                index=0;
				$("#myModal2").modal('hide');
//                htmlobj=$.ajax({
//                    type: "POST",
//                    url: "/askCode",
//                    data: {askCode:askCode},
//                    success: function(msg) {
//                        $("#showCode").text("Code:"+askCode);
//                    }
//                });
            });

            $("#nextone").click(function(){
                indextmp = index;
                index +=1;
                var askCode = $("#showCode").text();
                console.log("code:"+$("#showCode").text());
                htmlobj=$.ajax({
                    type: "POST",
                    url: "http://localhost/~yuchen/laravel/public/index.php/nextone",
                    data: {askCode:askCode,index:index,indextmp:indextmp},
                    success: function(msg) {
                        if(msg.state == 0)
                        {
                            index=3;
                            alert("没有题目啦");
                        }else {
                            console.log(msg);
                            $("#qusetionLabel").text(index + ". 题目: " + msg.question.timu);
                            $("#chooseA").text("A: " + msg.question.A);
                            $("#chooseB").text("B: " + msg.question.B);
                            $("#chooseC").text("C: " + msg.question.C);
                            $("#chooseD").text("D: " + msg.question.D);
                            if(msg.question.A == null)
                            {
                                $("#chooseA").hide();
                            }else{
                                $("#chooseA").show();
                            }
                            if(msg.question.B == null)
                            {
                                $("#chooseB").hide();
                            }else{
                                $("#chooseB").show();
                            }
                            if(msg.question.C == null)
                            {
                                $("#chooseC").hide();
                            }else{
                                $("#chooseC").show();
                            }
                            if(msg.question.D == null)
                            {
                                $("#chooseD").hide();
                            }else{
                                $("#chooseD").show();
                            }
                            $("#correctAnswer").hide();
                            $("#correctAnswer").text("正确答案: " + msg.question.correctAnswer);
                            $("#startState").text("");
                            htmlobj2=$.ajax({
                                type: "POST",
                                url: "http://localhost/~yuchen/laravel/public/index.php/startAnswer",
                                data: {'askCode':askCode,start:1,index:index},
                                success: function(msg) {
                                    $("#startBtn").text("停止答题");
                                    $("#startBtn").val("stop");
                                    $("#startBtn").removeClass('btn-primary');
                                    $("#startBtn").addClass('btn-default');
                                    $("#startState").text("答题开始");
                                }
                            });
                        }
                        //$("#showCode").text("Code:"+askCode);
                    }
                });
            });

            $("#uploadf").click(function(){
                var option = {
                    url : "http://localhost/~yuchen/laravel/public/index.php/",
                    success:function(msg){
                        //$("#askCodeText").val(msg.askCode);
                        $("#showCode").text(msg.askCode);
                        $("#downAskCode").val(msg.askCode);
                        console.log("upload success" + msg.askCode);
                        askCode = msg.askCode;
                        index=0;
						$("#myModal").modal('hide');
						$("#qusetionLabel").text("Code: " + askCode);
                    }
                }
                console.log("upload");
                $("#fileupload").ajaxForm(option).submit();
            });

            $("#beforeone").click(function() {
                indextmp = index;
                index--;
                var askCode = $("#showCode").text();
                console.log("code:" + $("#showCode").text());
                htmlobj = $.ajax({
                    type: "POST",
                    url: "http://localhost/~yuchen/laravel/public/index.php/nextone",
                    data: {askCode: askCode, index: index,indextmp:indextmp},
                    success: function (msg) {
                        if(msg.state == 0)
                        {
                            index = 1;
                            alert("没有题目啦");
                        }else {
                            console.log(msg);
                            $("#qusetionLabel").text(index + ". 题目: " + msg.question.timu);
                            $("#chooseA").text("A: " + msg.question.A);
                            $("#chooseB").text("B: " + msg.question.B);
                            $("#chooseC").text("C: " + msg.question.C);
                            $("#chooseD").text("D: " + msg.question.D);
                            if(msg.question.A == null)
                            {
                                $("#chooseA").hide();
                            }else{
                                $("#chooseA").show();
                            }
                            if(msg.question.B == null)
                            {
                                $("#chooseB").hide();
                            }else{
                                $("#chooseB").show();
                            }
                            if(msg.question.C == null)
                            {
                                $("#chooseC").hide();
                            }else{
                                $("#chooseC").show();
                            }
                            if(msg.question.D == null)
                            {
                                $("#chooseD").hide();
                            }else{
                                $("#chooseD").show();
                            }
                            $("#correctAnswer").hide();
                            $("#correctAnswer").text("正确答案: " + msg.question.correctAnswer);
                            $("#startState").text("");
                            $("#startBtn").text("开始答题");
                            $("#startBtn").val("start");
                            $("#startBtn").removeClass('btn-default');
                            $("#startBtn").addClass('btn-primary');
                            $("#startState").text("答题停止");
                        }
                    }
                });
            });

            $("#showAnswer").click(function(){
                if($("#showAnswer").val()=="show")
                {
                    $("#correctAnswer").show();
                    $("#showAnswer").val("hide");
                    $("#showAnswer").text("隐藏答案");
                }else{
                    $("#correctAnswer").hide();
                    $("#showAnswer").val("show");
                    $("#showAnswer").text("显示答案");
                }
            });

            $("#refershinfo").click(function(){
                askCode = $("#showCode").text();
                htmlobj=$.ajax({
                    type: "POST",
                    url: "http://localhost/~yuchen/laravel/public/index.php/statistic",
                    data: {'askCode':askCode,index:index},
                    success: function(msg) {
                        console.log(msg.fastAnswer);
                        $('#answerId').text("题目编号: " + index);
                        $('#answerCount').text("答题人数: " + msg.answerCount);
                        $("#correctRate").text("正确率:   "+msg.correctRate + "%");
                        $("#fastAnswer").text("答题最快者: " + msg.fastAnswer);
                        //$("#fastAnswer").hide();
                        //$("#otherAnswerDiv").empty();
                        count1 = 1;
                        for(count1 = 1; count1 <22;count1++)
						{
							$("#otheranslab"+count1).empty();
						}
                        
                        count = 2;
                        $.each(msg.allAnswerCount,function (key,value) {
                            //$("#otheranswer"+count).empty();
                            //otherAnswerbody = "<p id=\"#otheranswer"+count+"\" style=\"margin-left: 10px;margin-right: 10px;\">" +key +"  :  " + value + "</p>";
                            //console.log(otherAnswerbody);
							//counttmp = count-1;
							//$("#otheranslab1").append(otherAnswerbody);
                            $("#otheranslab"+count).text(key+" ：   答题人数："+value);
                            //("#otheranslab"+count).hide();
                            count++;
                        });
                        //$("#showCode").text("Code:"+askCode);
                    }
                });
            });

            $("#startBtn").click(function(){
                askCode = $("#showCode").text();
                if($("#startBtn").val()=="start")
                {
                    htmlobj=$.ajax({
                        type: "POST",
                        url: "http://localhost/~yuchen/laravel/public/index.php/startAnswer",
                        data: {'askCode':askCode,start:1,index:index},
                        success: function(msg) {
                            $("#startBtn").text("停止答题");
                            $("#startBtn").val("stop");
                            $("#startBtn").removeClass('btn-primary');
                            $("#startBtn").addClass('btn-default');
                            $("#startState").text("答题开始");
                            //$("#showCode").text("Code:"+askCode);
                        }
                    });
                }else{
                    htmlobj=$.ajax({
                        type: "POST",
                        url: "http://localhost/~yuchen/laravel/public/index.php/startAnswer",
                        data: {'askCode':askCode,start:0,index:index},
                        success: function(msg) {
                            $("#startBtn").text("开始答题");
                            $("#startBtn").val("start");
                            $("#startBtn").removeClass('btn-default');
                            $("#startBtn").addClass('btn-primary');
                            $("#startState").text("答题停止");
                            //$("#showCode").text("Code:"+askCode);
                        }
                    });
                }
            });

            $("#downloadResult").click(function(){
                askCode = $("#showCode").text();
                htmlobj=$.ajax({
                    type: "GET",
                    url: "http://localhost/~yuchen/laravel/public/index.php/save",
                    data: {'askCode':askCode},
                    success: function(msg) {
                        //window.location.href = msg;
                    }
                });
            });

            $("#upfontsize").click(function () {
                var currentFontSize = $("#questionPanel p").css("font-size");
                var currentFontSizeNumber = parseFloat(currentFontSize);
                var newFontSize = currentFontSizeNumber * 1.1;
                $("#questionPanel p").css("font-size", newFontSize);
                return false;
            });

            $("#downfontsize").click(function () {
                var currentFontSize = $("#questionPanel p").css("font-size");
                var currentFontSizeNumber = parseFloat(currentFontSize);
                var newFontSize = currentFontSizeNumber * 0.9;
                $("#questionPanel p").css("font-size", newFontSize);
                return false;
            });


            $("#showMore").click(function () {
                if($("#showMore").val()=="show")
                {
                    $("#moreinfoDiv > *").show();
                    $("#showMore").val('hide');
                    $("#showMore").text('隐藏详情');
                }else{
                    $("#moreinfoDiv > *").hide();
                    $("#showMore").val('show');
                    $("#showMore").text('显示详情');
                }
            });


        });




    </script>
</body>

<footer>

</footer>
</html>
